<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8" %>
<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles"%>
<%@ taglib prefix='c' uri='http://java.sun.com/jsp/jstl/core' %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    
<title><tiles:insertAttribute name="headtitle" ignore="true"/></title>

<link rel="stylesheet" type="text/css" media="screen" href="<c:url value='/resources/css/jquery/start/jquery-ui-1.10.3.custom.css'/>" />
<link rel="stylesheet" type="text/css" media="all"  href="<c:url value='/resources/css/kickstart/kickstart.css'/>"/> <!-- KICKSTART -->

<script type="text/javascript" src="<c:url value='/resources/js/jquery/jquery-1.9.0.min.js'/>"></script>
<script type="text/javascript" src="<c:url value='/resources/js/jquery/jquery-ui-1.10.3.custom.min.js'/>"></script>
<script type="text/javascript" src="<c:url value='/resources/js/kickstart/kickstart.js'/>"></script> <!-- KICKSTART -->
<script type="text/javascript">
$(document).ready(function() {
	/** 메뉴데이터를 구성하여 메뉴를 출력한다 */
    menuItems = ${leftMenuJsonStr}; // left메뉴 JSON Data
    
    // 메뉴구성
    activeFlag = false;
    childCount();
    setChildCount();
    
    var htmlTxt = recurseMenu(menuItems[0].PARENT_MENU_ID, 0);
    $("#left_menu").html(htmlTxt);
    
});

var h = new Object();
var menuItems; 
var activeFlag = false;

/** Left메뉴 조회,출력 */
function fn_leftMenu(menuPath, menuId, srcElement) {
	// 선택표시
	$("#top_menu .current").each(function() {
		$(this).removeClass("current");
	});
	$(srcElement).parent().addClass("current");
	
    $.ajax({
        type : "post",
        url : '<c:url value="/"/>/'+menuPath,
        dataType : "json",
        data : {MENU_ID:menuId},
        success : function(msg) {
            /** 메뉴데이터를 구성하여 메뉴를 출력한다 */
            activeFlag = false;
            
            menuItems = msg;            
            childCount();
            setChildCount();
            
            var htmlTxt = recurseMenu(menuId, 0);
            $("#left_menu").html(htmlTxt);
        },
        error : function(xhr, status, error) {
            console.log("--- callback error ---");
            var data = JSON.parse(xhr.responseText);
            if(data.errorCode == -1) {
                alert("작업중 오류가 발생하였습니다. \n message:"+data.errorMessage);
            }
        }
    });
} 

function childCount() {
    $.each(menuItems, function(key,value) {
       h[value.PARENT_MENU_ID] = (h[value.PARENT_MENU_ID]==undefined? 0:h[value.PARENT_MENU_ID])+1;
    });
    
}
function setChildCount() {
    $.each(menuItems, function(key,value) {
        var c = h[value.MENU_ID]==undefined?0:h[value.MENU_ID];
        value.CHILD_COUNT = c;   
    });
}

function recurseMenu(parent, level) {
    var c = (level == 0)? "class='menu vertical'":""; 
    htmlStrTxt = "<ul " + c + ">";

    for (var x in menuItems) {
        if (menuItems[x].PARENT_MENU_ID == parent) {
            
            var href = "javascript:void(0);"; 
            var onclick;
            if(menuItems[x].FOLDER_YN == "N") {
            	var menuPath = menuItems[x].MENU_PATH||' ';
                //link = '<c:url value="/"/>'+menuPath.substring(1);
                link = '${requestScope.contextPath}'+menuPath.substring(1);
                onclick = "javascript:fn_menuClick('"+link+"', this)";
            } else {
                onclick = "";
            }
            
            htmlStrTxt += '<li>' + '<a href="'+href+'" onclick="'+onclick+'">' + menuItems[x].MENU_NAME + "</a>";

            if (menuItems[x].CHILD_COUNT > 0) {
                htmlStrTxt += recurseMenu(menuItems[x].MENU_ID, level + 1);
            }
            htmlStrTxt += '</li>';
        }
    }
    return htmlStrTxt + '</ul>';
}

/** 메뉴이동 */
function fn_menuClick(menuPath, srcElement) {
	   // 선택표시
    $("#left_menu .current").each(function() {
        $(this).removeClass("current");
    });
    $(srcElement).parent().addClass("current");
    
    if($("#work_frame").length == 0) { // iframe이 존재하지않으면 생성
        var html = '<iframe id="work_frame" name="work_frame" src="" ' +
                          'frameborder="0" scrolling="auto" width="100%" height="880" ></iframe>';
        $("#work_area").html(html);                                  
    }
    $("#work_frame").attr("src", menuPath);
    
	console.log(menuPath);
}
</script>
</head> 

<body>
<!-- top -->
<div class="col_12 visible">
    <tiles:insertAttribute name="header" ignore="true"/>
</div>
<!-- //top -->

<!-- left -->
<div class="col_3">
    <tiles:insertAttribute name="menu" ignore="true"/>
</div>
<!-- //left -->
<!-- right -->
<div id="work_area" class="col_9">
    <tiles:insertAttribute name="body" ignore="true"/>
    <!-- IFRAME as layout-pane -->
    <!--<iframe id="work_frame" name="work_frame" src="" 
            frameborder="0" scrolling="auto" width="" height="" ></iframe>  -->
</div>
<!-- //right -->

<!-- bottom -->
<div class="col_12 visible">
    <tiles:insertAttribute name="footer" ignore="true"/>
</div>
<!-- //bottom -->
</body>
</html>